<template>
    <div>
     <div>累计总量：{{totalNum}}  约合现金：{{Math.floor(totalNum/100000) }} 累计点击次数:{{totalClickCount}}  平均金币 :{{Math.floor( totalNum/totalClickCount) }}</div>
      <!--引用表格-->
     <BasicTable @register="registerTable" :rowSelection="rowSelection">
       <!--插槽:table标题-->
        <template #tableTitle>
            
        </template>
        <!--字段回显插槽-->
        <template v-slot:bodyCell="{ column, record, index, text }">
        </template>
            <!--操作栏-->
        <template #action="{ record }">
            <a-button type="text" @click="handleDetail(record)"> 详情</a-button>
        </template>
      </BasicTable>
      <!-- 表单区域 -->
      <AppUserGoldDetailModal @register="registerModal" @success="handleSuccess"></AppUserGoldDetailModal>

      <!--字典配置抽屉-->
      <DictItemList @register="registerDrawer" />
    </div>
  </template>
  
  <script lang="ts" name="hd-appUserGoldDTotal" setup>
    import {ref, reactive, computed, unref} from 'vue';
    import {BasicTable, useTable, TableAction} from '/@/components/Table';
    import {useModal} from '/@/components/Modal';
    import { useListPage } from '/@/hooks/system/useListPage'
    import DictItemList from './components/DictItemList.vue';
    import { useDrawer } from '/@/components/Drawer';
    import AppUserGoldDetailModal from './components/AppUserGoldDetailModal.vue'
    import {childUserGoldTotalColumns, searchFormSchema, superQuerySchema} from './AppUserGoldDetail.data';
    import {getUserGoldTotalList,getChildUserGoldTotal} from './AppUserGoldDetail.api';
    import { useUserStore } from '/@/store/modules/user';
    const queryParam = reactive<any>({});
    const checkedKeys = ref<Array<string | number>>([]);
    const userStore = useUserStore();
    const totalNum= ref(0);
    const totalClickCount=ref(0);
    //字典配置drawer
    const [registerDrawer, { openDrawer }] = useDrawer();
    //注册model
    const [registerModal, {openModal}] = useModal();
    //注册table数据
    const { prefixCls,tableContext,onExportXls,onImportXls } = useListPage({
        tableProps:{
             title: 'app_user_gold_detail_child',
             api:(params)=>{
                getChildUserGoldTotal(params).then(res=>{
                    console.log(res)
                    totalNum.value= res.goldNum
                    totalClickCount.value=res.clickCount
                })
                return getUserGoldTotalList(params);
            },
             columns: childUserGoldTotalColumns,
             canResize:false,
             formConfig: {
                //labelWidth: 120,
                schemas: searchFormSchema,
              },
             actionColumn: {
                 width: 120,
                 fixed:'right'
              },
              beforeFetch: (params) => {
                return Object.assign(params, queryParam);
              },
        },
    })
    const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
  
    // 高级查询配置
    const superQueryConfig = reactive(superQuerySchema);
  
    /**
     * 高级查询事件
     */
    function handleSuperQuery(params) {
      Object.keys(params).map((k) => {
        queryParam[k] = params[k];
      });
      reload();
    }

      /**
   * 查看详情
   */
    function handleDetail(record) {
        console.log(queryParam)
        openDrawer(true, {
            userId: record.userId,
            day: queryParam.day,
        });
    }
     /**
      * 成功回调
      */
    function handleSuccess() {
        (selectedRowKeys.value = []) && reload();
     }
  
  </script>
  
  <style lang="less" scoped>
    :deep(.ant-picker),:deep(.ant-input-number){
      width: 100%;
    }
  </style>